// Bootstrap settings
@import '_variables';

.ethdocs-landing {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  h1{
    color: #ddd;
  }
  & > .ethdocs-landing-inner {
    height: 100%;
    & > .ethdocs-landing-graphic {
      float: left;
      width: 100%;
      background: url('/images/landing/keyboard.png') no-repeat center fixed;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
    }
    & > .ethdocs-landing-reference, & > .ethdocs-landing-wiki {
      padding: $padding-large-vertical * 2 $padding-large-horizontal * 2;
    }

    @media (max-width: $screen-xs-max) {
      overflow-y: auto;
      & > .ethdocs-landing-reference, & > .ethdocs-landing-wiki {
        float: left;
        width: 100%;
        background: #444;
      }
      & > .ethdocs-landing-wiki {
        border-bottom: 1px solid #333;
      }
      & > .ethdocs-landing-reference {
        border-top: 1px solid #555;
      }
    }

    @media (min-width: $screen-sm-min) {
      & > .ethdocs-landing-reference, & > .ethdocs-landing-wiki {
        position: absolute;
        top: $padding-large-vertical * 2;
        bottom: $padding-large-vertical * 2;
        overflow-y: auto;
      }
      & > .ethdocs-landing-wiki {
        left: $padding-large-horizontal * 2;
      }
      & > .ethdocs-landing-reference {
        right: $padding-large-horizontal * 2;
        text-align: right;
      }
    }

    & > h1 {
      margin: 0;
      padding: 0;
      color: #666;
    }

    ul {
      margin: 0;
      padding: 0;
      list-style: none;
      & > li {
        & > a {
          color: #aaa;
          &:hover {
            color: #fff;
          }
        }
      }
    }
  }
}
